#{extends 'AdminM/frame.html' /}

#{set 'moreScripts'}
<script src="@{'/public/javascripts/jquery-ui-1.8.10.custom.min.js'}" type="text/javascript" charset="utf-8"></script>
<script src="@{'/public/pager/jquery.pager.js'}" type="text/javascript" charset="utf-8"></script>
#{/set}
#{set 'moreStyles'}
<link rel="stylesheet" type="text/css" media="screen" href="@{'/public/pager/Pager.css'}" />
<link rel="stylesheet" type="text/css" media="screen" href="@{'/public/stylesheets/table.scss'}" />
#{/set}
#{set 'activeItem'}7#{/set}

<script src="@{'/public/pager/jquery.pager.js'}" type="text/javascript" charset="utf-8"></script>
<script src="@{'/public/javascripts/jquery-ui-1.8.10.custom.min.js'}" type="text/javascript" charset="utf-8"></script>

<script language="javascript">

	$(function(){
		//初始化创建窗口
		$("#create-form").dialog({autoOpen:false,modal:true,
        buttons:{提交:function(){createPro();}}
			})
			
		//初始化修改窗口
		$("#update-form").dialog({autoOpen:false,modal:true,
        buttons:{提交:function(){updatePro();}}
			})
		
		});

	//刷新页面
	function doSearch() {
		$("#form1").submit();
	}
	
	//删除 城市
	function removeItem(id) {
	
	var provid = $("#providId").val();
		$.ajax({
			url: "@{admin.Areas.deleteCity()}",
			data: "provid="+provid+"&cityId="+id,
			type: "GET",
			complete: function() {
				doSearch();
			}
		});
	}
	
	//打开创建窗口
	function openCreateDialog(){
       $("#create-form").dialog("open");
	}
	
	//打开修改窗口
	function openUpdateDialog(id,codeVal,nameVal){
	   $("#cityId").val(id);
	   $("#updatecodeId").val(codeVal);
	   $("#updatenameId").val(nameVal);
	   
       $("#update-form").dialog("open");
	}
	
	//提交创建信息
	function createPro() {
		var codeVal = $("#codeId").val();
		var nameVal= $("#nameId").val();
		var provid = $("#providId").val();
	
		$.ajax({
			url: "@{admin.areas.createCity()}",
			data: "codeVal="+codeVal+"&"+"nameVal="+nameVal+"&provid="+provid,
			type: "GET",
			complete: function() {
				doSearch();
			}
		});
	}
	
	//提交修改信息
	function updatePro() {
		var codeVal = $("#updatecodeId").val();
		var nameVal= $("#updatenameId").val();
		var cityId = $("#cityId").val();
	
		$.ajax({
			url: "@{admin.areas.updateCity()}",
			data: "codeVal="+codeVal+"&"+"nameVal="+nameVal+"&"+"cityId="+cityId,
			type: "GET",
			complete: function() {
				doSearch();
			}
		});
	}
	
</script>
<div class="navigationBar">
	<table>
		<tr>
			<td><img src="@{'/public/images/navigationHouse.gif'}"></td>
			<td><strong>当前位置：</strong></td>
			<td>
				<a href="/admin">首页</a>
				>>
				<a href="#">运价管理</a>
				>>
				<font class="current">城市管理</font>
			</td>
		</tr>
	</table>
</div>

<div>
	
	<div>
		#{form @admin.areas.indexCity(), name:'form1', id:'form1'}
			<input type="hidden" id="providId" name="provid" value="${provid}">
   		#{/form}              
	</div>

<div>
	#{if cityList}  
	<table class="common-table">
		<tr>
			<td>ID</td>
			<td>省份</td>
			<td>城市代号</td>
			<td>城市名称</td>
			<td>操作 </td>
		</tr>
		#{list items:cityList, as:'city'}
		<tr>
			<td>${city.id}</td>
			<td>${city.province.name}</td>
			<td>${city.cityCode}</td>
			<td>${city.cityName}</td>
			<td>
				<a class="editer" href="javascript:openUpdateDialog('${city.id}','${city.cityCode}','${city.cityName}')">[修改]</a>&nbsp;
				<a class="editer" href="javascript:removeItem(${city.id})">[删除]</a>&nbsp;
			</td>
		</tr>  		
		#{/list}
	</table>			
	#{/if}
	#{else}
		还没为该省份添加城市
	#{/else}
</div>

<div>
<input type="button" value="添加" onclick="javascript:openCreateDialog();">
</div>

<div id="create-form" class="ui-widget ui-widget-content ui-corner-all" title="创建城市">
    <form id="create-form">
    代码：<input type="text" size="20" id="codeId"><br><br>
    名称：<input type="text" size="20" id="nameId">
    </form>
</div>

<div id="update-form" class="ui-widget ui-widget-content ui-corner-all" title="修改城市">
    <form id="create-form">
    <input type="hidden" id="cityId">
    代码：<input type="text" size="20" id="updatecodeId"><br><br>
    名称：<input type="text" size="20" id="updatenameId">
    </form>
</div>

</div>
